<template>
    <div class="mod-room">
        <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
            <el-form-item>
                <el-input v-model="dataForm.houseNumber" placeholder="门牌号" clearable></el-input>
            </el-form-item>
            <!--小区-->
            <el-form-item label="小区" v-if="superAdmin == 1">
               <el-cascader v-model="housEasteAddress" ref="housate" :options="housEasteOptions" @active-item-change="getHousEaste" :props="housEasteProps"></el-cascader>
            </el-form-item>
            <el-form-item label="楼栋">
               <el-cascader v-model="buildingAddress" ref="build" :options="buildingOptions" @active-item-change="getbuilding" :props="buildingProps"></el-cascader>
            </el-form-item>
            <el-form-item>
                <el-button @click="getDataList()">{{ $t('handle.search') }}</el-button>
                <el-button  type="primary" @click="addOrUpdateHandle()">{{ $t('handle.add') }}</el-button>
                <el-button  type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">{{ $t('handle.batchDelete') }}</el-button>
            </el-form-item>
        </el-form>
        <el-table
            :data="dataList"
            border
            v-loading="dataListLoading"
            @selection-change="selectionChangeHandle"
            style="width: 100%;">
            <el-table-column
                type="selection"
                header-align="center"
                align="center"
                width="50">
            </el-table-column>
            <el-table-column
                v-if='show'
                prop="id"
                header-align="center"
                align="center"
                width="80"
                label="ID">
            </el-table-column>
            <el-table-column
                type="index"
               :label="$t('tabble.No')"
                width="50"
                :index="indexMethod">
            </el-table-column>
            <el-table-column
                prop="householderName"
                header-align="center"
                align="center"
                label="户主">
            </el-table-column>
            <el-table-column
                prop="buildingName"
                header-align="center"
                align="center"
                label="所在楼栋">
            </el-table-column>
            <el-table-column
                prop="unitNumber"
                header-align="center"
                align="center"
                label="单元号">
            </el-table-column>
            <el-table-column
                prop="floorCode"
                header-align="center"
                align="center"
                label="楼层号">
            </el-table-column>
            <el-table-column
                prop="positionNumber"
                header-align="center"
                align="center"
                label="位置号">
            </el-table-column>
            <el-table-column
                prop="houseNumber"
                header-align="center"
                align="center"
                label="门牌号">
            </el-table-column>
            <!-- <el-table-column
                prop="dgStandardInfoId"
                header-align="center"
                align="center"
                label="房屋地址">
            </el-table-column> -->
            <!-- <el-table-column
                prop="isLet"
                header-align="center"
                align="center"
                label="是否出租">
                <template slot-scope="scope">
                    <span>{{dictTypeFilter(scope.row.isLet)}}</span>
                </template>
            </el-table-column> -->
            <el-table-column
                prop="housingClassification"
                header-align="center"
                align="center"
                label="房屋分类">
                <template slot-scope="scope">
                    <span>{{housingClassificationFilter(scope.row.housingClassification)}}</span>
                </template>
            </el-table-column>
            <!-- <el-table-column
                prop="managerId"
                header-align="center"
                align="center"
                label="管理者">
            </el-table-column>
            <el-table-column
                prop="delFlag"
                header-align="center"
                align="center"
                label="是否删除">
                <template slot-scope="scope">
                    <span>{{dictRoomFilter(scope.row.delFlag)}}</span>
                </template> -->
                <!-- <template slot-scope="scope">
                <el-tag v-if="scope.row.isSystem === 2" size="small" type="danger">{{ $t('handle.delete') }}</el-tag>
                <el-tag v-else size="small">未删除</el-tag>
                </template> -->
            <!-- </el-table-column> -->
            <el-table-column
                fixed="right"
                header-align="center"
                align="center"
                width="150"
                :label="$t('handle.handle')">
                <template slot-scope="scope">
                <el-button  type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('handle.update') }}</el-button>
                <el-button  type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('handle.delete') }}</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
            @size-change="sizeChangeHandle"
            @current-change="currentChangeHandle"
            :current-page="pageIndex"
            :page-sizes="[10, 20, 50, 100]"
            :page-size="pageSize"
            :total="totalPage"
            layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
  </div>
</template>
<script>
import AddOrUpdate from './room-add-or-update'
import { exists } from 'fs';
export default {
    data(){
        return {
            superAdmin: sessionStorage.getItem("superAdmin"),
            dataForm: {
               houseNumber: '',
               buildingId: '' ,
               housIngId: ''
            },
           housEasteAddress: [],
           housEasteOptions: [],
           housEasteProps: {
                value: "id",
                label: "name",
                children: "children"
            },
            buildingAddress: [],
            buildingOptions: [],
            buildingProps: {
                value: "id",
                label: "name",
                children: "children"
            },
            dataList: [],
            pageIndex: 1,
            pageSize: 10,
            totalPage: 0,
            dataListLoading: false,
            dataListSelections: [],
            addOrUpdateVisible: false,
            dicts:[],
            dictType:{1:'出租'},
            show: false,
            roomDictType: {1: '未删除'},
            roomDicts: [],
            housingClassificationDicts: [],
            housingClassificationDictType: {1: '固定用房'}
        }
    },
    computed: {
        // 是否出租
    dictTypeFilter () {
      return function (type) {
            /** do something */
            return this.dictType[type]
        }
    },
    // 是否删除
    dictRoomFilter(){
        return function (type){
            return this.roomDictType[type]
        }
    },
    housingClassificationFilter(){
        return function (type){
            return this.housingClassificationDictType[type]
        }
    }
  },
      // 引入的组件
    components: {
      AddOrUpdate
    },
    created() {
         if (this.superAdmin == 1) {
            this.getOne();
        }
        this.getRoomIsLet()
        this.getHousingClassification()
        // this.getOne()
        this.getCountry()
    },
    // 一进页面就加载
    activated (){
        this.getDataList()
        // this.getAllBuild()
        // this.getAllHous()
    },
    methods: {
         // 楼栋
        getbuilding(val){
            if(val.length === 1){
                this.getProvice(val[0])
            }else if(val.length === 2){
                this.getCity(val[0],val[1])
            }else if(val.length === 3){
                this.getArea(val[0],val[1],val[2])
            }else if(val.length === 4){
                this.getCommunty(val[0],val[1],val[2],val[3])
            }else if(val.length === 5){
                this.getHousing(val[0],val[1],val[2],val[3],val[4])
            }else if(val.length === 6){
                this.getBuild(val[0],val[1],val[2],val[3],val[4],val[5])
            }
        },
        getCountry(){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: 0,type:11}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.buildingOptions = data.data

                }
            })
        },
        getProvice(countryId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: countryId,type:12}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                   this.buildingOptions.map(item=>{
                       if(item.id === countryId){
                           item.children = data.data
                       }
                   })
                }
            })
        },
        getCity(countryId,provinceId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: provinceId,type:13}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                   this.buildingOptions.map((item, i) => {
                        if (item.id === countryId) {
                            item.children.map((city, id) => {
                                 city.children = data.data;
                            });
                        }
                    });
                }
            })
        },
        getArea(countryId,provinceId,cityId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: cityId,type:31}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.buildingOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                    city.children = data.data
                                });
                            }
                        });
                        }
                    });
                }

            })
        },
        getCommunty(countryId,provinceId,cityId,areaId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: areaId,type:32}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.buildingOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                  if(city.id === cityId){
                                    city.children.map((area,aid)=>{
                                      area.children =data.data
                                    })
                                  }
                                });
                            }
                        });
                        }
                    });
                }
            })
        },
        getHousing(countryId,provinceId,cityId,areaId,communityCodeId){
            this.$http({
                url: `/dg-ic/ic/housing-estate/getByCommuntId/${communityCodeId}`,
                method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.buildingOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                    if(city.id === cityId){
                                        city.children.map((area,aid)=>{
                                            if(area.id === areaId){
                                                area.children.map((communt,ic)=>{
                                                    communt.children = data.data
                                                })
                                            }
                                        })
                                    }
                                });
                            }
                        });
                        }
                    });
                }

            })
        },
        getBuild(countryId,provinceId,cityId,areaId,communityCodeId,housId){
            this.$http({
                url: `/dg-ic/ic/building/getByHousing/${housId}`,
                method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        // this.$set(item, "children", []);
                    });
                    this.buildingOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                    if(city.id === cityId){
                                        city.children.map((area,aid)=>{
                                            if(area.id === areaId){
                                                area.children.map((communt,ic)=>{
                                                    if(communt.id === communityCodeId){
                                                        communt.children.map((house,iu)=>{
                                                            house.children = data.data
                                                            // if(house.id === housId){
                                                            //    house.children.map((build,il)=>{
                                                            //        build.children = data.data
                                                            //    })
                                                            // }
                                                        })
                                                    }
                                                })
                                            }
                                        })
                                    }
                                });
                            }
                        });
                        }
                    });
                }

            })
        },
        getHousEaste(val){
            if(val.length === 1){// 获取省
                this.getTwo(val[0])
            }else if(val.length === 2){// 市
                this.getThree(val[0],val[1])
            }else if(val.length === 3){// 区
                this.getFour(val[0],val[1],val[2])
            }else if(val.length === 4){
                this.getFive(val[0],val[1],val[2],val[3]) //社区
            }else if(val.length === 5){
                this.getSix(val[0],val[1],val[2],val[3],val[4])// 小区
            }
        },
        // 一级
        getOne(){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: 0,type:11}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.housEasteOptions = data.data

                }
            })
        },
        // 二级
        getTwo(countryId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: countryId,type:12}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                   this.housEasteOptions.map(item=>{
                       if(item.id === countryId){
                           item.children = data.data
                       }
                   })
                }
            })
        },
        getThree(countryId,provinceId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: provinceId,type:13}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                   this.housEasteOptions.map((item, i) => {
                        if (item.id === countryId) {
                            item.children.map((city, id) => {
                                 city.children = data.data;
                            });
                        }
                    });
                }
            })
        },
        getFour(countryId,provinceId,cityId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: cityId,type:31}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.housEasteOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                    city.children = data.data
                                });
                            }
                        });
                        }
                    });
                }

            })
        },
        getFive(countryId,provinceId,cityId,areaId){
            this.$http({
                url: `/dg-standard-info/dgstandardaddress/childlistbyparentandtype`,
                method: 'post',
                params:{parentId: areaId,type:32}
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        this.$set(item, "children", []);
                    });
                    this.housEasteOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                  if(city.id === cityId){
                                    city.children.map((area,aid)=>{
                                      area.children =data.data
                                    })
                                  }
                                });
                            }
                        });
                        }
                    });
                }
            })
        },
        getSix(countryId,provinceId,cityId,areaId,communityCodeId){
            this.$http({
                url: `/dg-ic/ic/housing-estate/getByCommuntId/${communityCodeId}`,
                method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                    data.data.map(item => {
                        this.$set(item, "name", item.name);
                        // this.$set(item, "children", []);
                    });
                    this.housEasteOptions.map((item, i) => {
                        if (item.id === countryId) {
                        item.children.map((provice, idx) => {
                            if(provice.id === provinceId){
                                provice.children.map((city, ids) => {
                                    if(city.id === cityId){
                                        city.children.map((area,aid)=>{
                                            if(area.id === areaId){
                                                area.children.map((communt,ic)=>{
                                                    communt.children = data.data
                                                })
                                            }
                                        })
                                    }
                                });
                            }
                        });
                        }
                    });
                }

            })
        },
        // 房屋分类
        getHousingClassification(){
            this.$http({
            url: 'dg-ic/ic/dict/type/housingClassification_type',
            method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                this.housingClassificationDicts = data.data;
                for(let i = 0; i < data.data.length; i++){
                    this.housingClassificationDictType[data.data[i].value] = data.data[i].label;
                };
                }
            })
        },
        // 删除标识
        getRoomDel(){
            this.$http({
            url: 'dg-ic/ic/dict/type/del_status',
            method: 'get'
            }).then(({data})=>{
                if(data && data.code === 0){
                this.roomDicts = data.data;
                for(let i = 0; i < data.data.length; i++){
                    this.roomDictType[data.data[i].value] = data.data[i].label;
                };
                }
            })
        },
        // 出租
        getRoomIsLet(){
            this.$http({
                url: 'dg-ic/ic/dict/type/room_isLet',
                method: 'get'
                }).then(({data})=>{
                    if(data && data.code === 0){
                    this.dicts = data.data;
                    for(let i = 0; i < data.data.length; i++){
                        this.dictType[data.data[i].value] = data.data[i].label;
                    };
                    }
                })
        },
        indexMethod(index){
            return index+1
        },
        // 获取数据列表
        getDataList(){
            this.dataListLoading = true
            this.$http({
                url: `/dg-ic/ic/room/list`,
                method: 'get',
                params: this.$http.adornParams({
                'page': this.pageIndex,
                'limit': this.pageSize,
                'houseNumber': this.dataForm.houseNumber,// 门牌号
                'buildingId': this.buildingAddress[this.buildingAddress.length-1],// 楼栋
                'housingEstateId': this.housEasteAddress[this.housEasteAddress.length-1],// 小区
                'housingId': sessionStorage.getItem("thiscommunityId") || ""
                })
            }).then(({data})=>{

                if(this.superAdmin === 1){
                    let obj = {}
                    obj.stopPropagation = () =>{}
                    this.$refs.housate.clearValue(obj)
                }
                let obj1 = {}
                obj1.stopPropagation = () =>{}
                this.$refs.build.clearValue(obj1)


                if(data && data.code === 0){
                    this.dataList = data.data.list
                    this.totalPage = data.data.totalCount
                }else{
                    this.dataList = []
                    this.totalPage = 0
                }
                this.dataListLoading = false
            })
        },
         // 每页数
        sizeChangeHandle(val){
            this.pageSize = val
            this.pageIndex = 1
            this.getDataList()
        },
         // 当前页
        currentChangeHandle(val){
            this.pageIndex = val
            this.getDataList()
        },
        // 多选
        selectionChangeHandle(val){
            this.dataListSelections = val
        },
        // 新增/修改
        addOrUpdateHandle(id){
            this.addOrUpdateVisible = true
            this.$nextTick(()=>{
                this.$refs.addOrUpdate.init(id,this.dicts,this.housingClassificationDicts)
            })
        },
        // 删除
        deleteHandle(id){
            var ids = id ? [id] : this.dataListSelections.map(item=>{
              return item.id
          })
          this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`,'提示',{
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
          }).then(()=>{
              this.$http({
                  url: `/dg-ic/ic/room/delete`,
                  method: 'delete',
                  data: this.$http.adornData(ids,false)
              }).then(({data})=>{
                if(data && data.code === 0){
                this.$message({
                    message: '删除成功',
                    type: 'success',
                    duration: 1500,
                    onClose: ()=>{
                    this.getDataList()
                    }
                })
            }
            })
          }).catch(()=>{})
        },
    }

}
</script>

